<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8">
	<link rel="stylesheet" href="../../static/css/bootstrap.min.css">
	<link rel="stylesheet" href="../../static/css/ylb.css">
	<link rel="shortcut icon" href="../../static/img/logo.png">
	<script type="text/javascript" src="../../static/js/jquery.min.js"></script>
	<script type="text/javascript" src="../../static/js/popper.min.js"></script>
	<script type="text/javascript" src="../../static/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="../../static/js/qrcode.min.js"></script>
	<script type="text/javascript" src="../../static/js/clipboard.min.js"></script>
	<script type="text/javascript" src="./channel.js"></script> 
</head>
<body>

<div id="app">
	
	<!-- 左侧 -->
	<div class="left">
		<div class="dhview">

			<!-- LOGO -->
			<a href="../index/" class="index">
			    <div class="logo"></div>
			</a>

			<!-- 导航 -->
			<ul>
			    <a href="../index/" >
			    <li class="nav-li">
			        <i class="icon i-data"></i>
			        <span class="nav-text">数据</span>
			    </li>
			    </a>
			    
			    <a href="../qun/" class="selected">
			    <li class="nav-li">
			        <i class="icon i-hm-dark"></i>
			        <span class="nav-text">活码</span>
			    </li>
			    </a>
			    
				<a href="../dwz/">
				<li class="nav-li">
				    <i class="icon i-dwz"></i>
				    <span class="nav-text">短网址</span>
				</li>
				</a>
				
				<a href="../tbk/">
				<li class="nav-li">
				    <i class="icon i-tbk"></i>
				    <span class="nav-text">淘宝客</span>
				</li>
				</a>
				
				<a href="../shareCard/">
				<li class="nav-li">
				    <i class="icon i-share"></i>
				    <span class="nav-text">分享卡片</span>
				</li>
				</a>
				
				<a href="../plugin/">
				<li class="nav-li">
				    <i class="icon i-plugin"></i>
				    <span class="nav-text">插件中心</span>
				</li>
				</a>
				
				<a href="../kami/">
				<li class="nav-li">
				    <i class="icon i-kami"></i>
				    <span class="nav-text">卡密分发</span>
				</li>
				</a>
				
				<a href="../config/">
				<li class="nav-li">
				    <i class="icon i-config"></i>
				    <span class="nav-text">配置中心</span>
				</li>
				</a>
				
				<a href="../sucai/">
				<li class="nav-li">
				    <i class="icon i-sucai"></i>
				    <span class="nav-text">素材管理</span>
				</li>
				</a>
				
				<a href="../user/">
				<li class="nav-li">
				    <i class="icon i-account"></i>
				    <span class="nav-text">账号管理</span>
			    </li>
			    </a>
			</ul>

			<!-- 账号 -->
			<div class="account">加载中...</div>
		    
		</div>
	</div>

	<!-- 右侧 -->
	<div id="right">
	    
		<h3>活码 ➜ <span class="mbx">渠道码</span></h3>
		<div class="data-card">
		    
			<!-- 按钮区域 -->
			<div class="button-view" id="button-view" style="display:none;">
			    
			    <!--flex布局按钮容器-->
			    <div class="flex-button-view">
			        
    			    <!--导航-->
    			    <div class="button-daohang">
    			        <a href="../qun/"><button class="tint-btn">群活码</button></a>
    			        <a href="../kf/"><button class="tint-btn" style="margin-left: 5px;">客服码</button></a>
    				    <a href="../channel/"><button class="default-btn" style="margin-left: 5px;">渠道码</button></a>
    			    </div>
    			    
    			    <!--功能-->
    			    <div class="button-gongneng">
    			        
    			        <button class="tint-btn" 
        				data-toggle="modal" 
        				data-target="#CreateChannelModal" 
        				onclick="getDomainNameList('creat')">创建渠道码</button>
        				
        				<a href="./channelAccessDenied.html">
        				    <button class="tint-btn" style="margin-left: 5px;">IP黑名单</button>
        				</a>
    			    </div>
			    </div><!-- flex-button-view -->
			</div>

			<!-- 列表区域 -->
			<div class="data-list">

				<table class="table">
				    <thead></thead>
				    <tbody></tbody>
				</table>

			</div><!-- data-list -->
			
			<p class="loading" style="display: none;"></p>
			
			<!-- 分页 -->
			<div class="fenye"></div>
			
		</div><!-- data-card -->
	</div><!-- right -->

	<!-- 创建渠道码 -->
    <div class="modal fade" id="CreateChannelModal">
        <div class="modal-dialog">
            <div class="modal-content" style="width:650px;">
                
                    <!-- 头部 -->
                    <div class="modal-header">
                        <h4 class="modal-title">创建渠道码</h4>
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div><!-- modal-header -->
                    
                    <!-- 表单 -->
                    <div class="modal-body">
                        <form id="creatChannel">
                        <span class="text">标题</span>
                        <input type="text" name="channel_title" class="form-control" autocomplete="off" placeholder="标题或渠道名称">
                        
                        <div style="width:100%;height:70px;margin:-5px auto 20px;display:flex;">
                            <div style="flex:1;margin-right:7px;">
                                <span class="text">短链域名</span>
                                <select name="channel_dlym" class="form-control" title="短链域名"></select>
                            </div>
                            <div style="flex:1;margin-right:7px;">
                                <span class="text">入口域名</span>
                                <select name="channel_rkym" class="form-control" title="入口域名"></select>
                            </div>
                            <div style="flex:1;">
                                <span class="text">落地域名</span>
                                <select name="channel_ldym" class="form-control" title="落地域名"></select>
                            </div>
                        </div>
                        
                        <span class="text">推广链接</span>
                        <input type="text" name="channel_url" class="form-control" autocomplete="off" placeholder="你所推广的链接链接">
                        
                        </form>
                    </div><!-- modal-body -->
                    
                    <!-- 底部操作 -->
                    <div class="modal-footer">
                        
                        <div class="footer-btn">
                        <div class="faqnav" title="阅读使用指南">
                            <span class="faq"><a href="../faq.php?faq=channel" target="_blank">?</a></span>
                        </div>
                        
                        <div class="btnnav">
                            <button type="button" class="default-btn" onclick="creatChannel();">立即创建</button>
                        </div>
                    </div>
                </div><!-- modal-footer -->
                
                <!-- 操作反馈 -->
                <div class="result"></div>
                
            </div><!-- modal-content -->
        </div><!-- modal-dialog -->
    </div><!-- CreateChannelModal -->
  	
  	<!-- 编辑渠道码 -->
    <div class="modal fade" id="editChannelModal">
        <div class="modal-dialog">
            <div class="modal-content" style="width:650px;">
                
                <!-- 头部 -->
                <div class="modal-header">
                    <h4 class="modal-title">编辑渠道码</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div><!-- modal-header -->
                
                <!-- 表单 -->
                <div class="modal-body">
                <form id="editChannel" enctype="multipart/form-data">
                    <span class="text">标题</span>
                    <input type="text" name="channel_title" class="form-control" autocomplete="off" placeholder="标题或渠道名称">
                    
                    <div style="width:100%;height:70px;margin:-5px auto 20px;display:flex;">
                        <div style="flex:1;margin-right:7px;">
                            <span class="text">短链域名</span>
                            <select name="channel_dlym" class="form-control" title="短链域名"></select>
                        </div>
                        <div style="flex:1;margin-right:7px;">
                            <span class="text">入口域名</span>
                            <select name="channel_rkym" class="form-control" title="入口域名"></select>
                        </div>
                        <div style="flex:1;">
                            <span class="text">落地域名</span>
                            <select name="channel_ldym" class="form-control" title="落地域名"></select>
                        </div>
                    </div>
                    
                    <span class="text">推广链接</span>
                    <input type="text" name="channel_url" class="form-control" autocomplete="off" placeholder="你所推广的链接">
                    
                    <input type="hidden" name="channel_id">
                </form>
                </div><!-- modal-body -->
                
                <!-- 底部操作 -->
                <div class="modal-footer">
                    
                    <div class="footer-btn">
                        
                    	<div class="faqnav" title="阅读使用指南">
                    	    <span class="faq"><a href="../faq.php?faq=channel" target="_blank">?</a></span>
                    	</div>
                    	
                    	<div class="btnnav">
                    	    <button type="button" class="default-btn" onclick="editChannel();">提交更新</button>
                    	</div>
                    </div>
                </div><!-- modal-footer -->
                
                <!-- 操作反馈 -->
                <div class="result"></div>
                
            </div><!-- modal-content -->
        </div><!-- modal-dialog -->
    </div><!-- editChannelModal -->
  	
  	<!-- 确定删除渠道码 -->
    <div class="modal fade" id="DelChannelHm">
        <div class="modal-dialog">
            <div class="modal-content">
                
                <!-- 头部 -->
                <div class="modal-header">
                    <h4 class="modal-title">删除渠道码</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div><!-- modal-header -->
                
                <!-- 内容 -->
                <div class="modal-body">
                    将会删除该渠道码及其所有渠道来源数据！
                </div><!-- modal-body -->
                
                <!-- 底部操作 -->
                <div class="modal-footer"></div><!-- modal-footer -->
                
                <!-- 操作反馈 -->
                <div class="result"></div>
                
            </div><!-- modal-content -->
        </div><!-- modal-dialog -->
    </div><!-- DelChannelHm -->
    
    <!-- 分享渠道码 -->
    <div class="modal fade" id="shareChannelHm">
        <div class="modal-dialog">
            <div class="modal-content">
                
                <!-- 头部 -->
                <div class="modal-header">
                    <h4 class="modal-title">分享渠道码</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div><!-- modal-header -->
                
                <!-- 表单 -->
                <div class="modal-body">
                    <div class="box">
                        <div class="longUrl"><span class="text">长链接：</span><span id="longUrl"></span></div>
                        <div class="shortUrl"><span class="text">短链接：</span><span id="shortUrl"></span></div>
                        <div class="Qrcode" id="shareQrcode"></div>
                    </div>
                </div><!-- modal-body -->
                
                <!-- 底部操作 -->
                <div class="modal-footer"></div>
                
                <!-- 操作反馈 -->
                <div class="result"></div>
                
            </div><!-- modal-content -->
        </div><!-- modal-dialog -->
    </div><!-- shareChannelHm -->
    
    <!-- 全局信息提示框 -->
    <div id="notification">
        <div id="notification-text"></div>
    </div>

</div><!-- app -->


<script type="text/javascript">

// 上传客服二维码（上传客服子码）
$("#uploadZmQrcode").change(function(e){
    
    // 获取选择的文件
    var fileSelect = e.target.files;
    if(fileSelect.length>0){
        
        // file表单数据
        var imageData = new FormData(document.getElementById("uploadZmQrcodeForm"));
        // kf_id
        var kf_id = $("#uploadZmQrcode_kf_id").val();
        
        // 异步上传
        $.ajax({
            url:"./uploadZmQrcode.php",
            type:"POST",
            data:imageData,
            cache: false,
            processData: false,
            contentType: false,
            success: function(res) {
                
                if(res.code == 200){
                    
                    // 上传成功
                    // 刷新子码列表
                    freshenKfzmList(kf_id)
                }else{
                    
                    // 上传失败
                    showErrorResult(res.msg)
                }
                
            },
            error: function() {
                
                // 上传失败
                showErrorResult('服务器发生错误！可按F12打开开发者工具点击Network或网络查看返回信息进行排查！')
            }
        })
    }
})

// 上传客服二维码（更换客服子码）
$("#selectKfzmQrcode").change(function(e){
    
    // 获取选择的文件
    var fileSelect = e.target.files;
    if(fileSelect.length>0){
        
        // file表单数据
        var imageData = new FormData(document.getElementById("editKfzm"));
        
        // 异步上传
        $.ajax({
            url:"../upload.php",
            type:"POST",
            data:imageData,
            cache: false,
            processData: false,
            contentType: false,
            success: function(res) {
                
                if(res.code == 200){
                    
                    // 上传成功
                    $('#zm_qrcode_edit').val(res.url);
                    $('#EditKfZm .modal-body .upload_file').css('display','none');
                    $('#EditKfZm .modal-body .qrcode_preview').css('display','block');
                    $('#EditKfZm .modal-body .qrcode_preview').html('<img src="'+res.url+'" class="qrcode" /><p class="uploadSuccess">上传成功</p>');
                    
                }else{
                    
                    // 上传失败
                    showErrorResult(res.msg)
                    // 清空file选择的文件以重试
                    $("#selectKfzmQrcode").val('');
                }
                
            },
            error: function() {
                
                // 上传失败
                showErrorResult('服务器发生错误！可按F12打开开发者工具点击Network或网络查看返回信息进行排查！')
                // 清空file选择的文件以重试
                $("#selectKfzmQrcode").val('');
            }
        })
    }
})

</script>


</body>
</html>